<template>
	<view class="manage_box box">
		<view class="">
			<template v-for="(item, index) in dataList">
				<view class="height_12">

				</view>
				<view class="info_box box width_351 height_133 ml_12 mr_12 br_8 bc_fff">
					<view class="info_top w100 height_64">
						<view class="top_left">
							<view class="width_52 height_52 br_42 photo_view_box">
								<image class="user_avatar"
									:src="item.avatar ? item.avatar : ossUrl + '/avatar_empty.png'" mode=""></image>
							</view>
							<view class="info_view ml_12">
								<view class="name_box">
									<view :class="item.accountInfo.totalEnterprise>9999?'fz_16 mr_8 fc_333 user_name_box':'fz_16 mr_8 fc_333 big_user_name_box'">
										{{ item.nickName }}
									</view>
									<image :src="ossUrl + '/info_' + item.memberLevel + '.png'"
										class="width_88 height_22" mode="">
									</image>
								</view>
								<view class="fz_12 fc_999 mt_8">
									{{ item.registerTime }}
								</view>
							</view>

						</view>
						<view class="top_right fz_12 fc_999">
							<view class="bottom_left">
								<view class="number fz_16 fb mb-6">
									¥{{ item.accountInfo.totalEnterprise || 0 }}
								</view>
								<view class="fz_12 fc_333 mt_6">
									消费总额
								</view>
							</view>
						</view>
					</view>
					<view class="info_bottom w100 height_69">
						<view class="guide_left">
							<view class="fz_14 fc_333" v-show="(userType==3 &&(item.managerShopName||item.guideName))||(userType==2&&item.guideName) ">
							导购：{{item.managerShopName&&userType==3?item.managerShopName:''}}{{ item.guideName?item.guideName:'' }}
						</view>
						</view>
						
						<view :style="[btnStyle]" class="bottom_right width_112 height_40 br_112 fz_14 fc_fff"
							@click="bindPhoneCall(item.phone)">
							<image class="width_16 height_16" src="../../../../static/images/invite_phone_icon.png"
								mode=""></image>
							<view class="ml_8">
								联系会员
							</view>
						</view>
					</view>
				</view>
			</template>
		</view>
		<view class="height_19">

		</view>
	</view>
</template>

<script>
	import color from "../../../../uni_modules/uview-ui/libs/config/color"
	import Empty from "./empty.vue"
	export default {
		components: {
			Empty
		},
		props: {
			dataList: {
				type: Array,
				default: function() {
					return []
				}
			},
			ossUrl: {
				type: String,
				default: ""
			},
			userType: {
				type: Number,
				default: 4
			},
			isRequest: {
				type: Boolean,
				default: false
			}
		},
		mounted() {
			setTimeout(() => {

				console.log("邀请数据")
				console.log(this.dataList)
				console.log(this.dataList[0])
			}, 1000)
		},
		data() {
			return {}
		},
		computed: {
			btnStyle() {
				return {
					backgroundColor: this.userType == 3 ? '#F08519' : '#FE5A1C'
				}
			},
		},
		methods: {
			bindPhoneCall(phoneNumber) {
				uni.makePhoneCall({
					phoneNumber: phoneNumber,
					success() {

					},
					fail() {

					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.manage_box {

		.search_box {
			@include set_padding(14rpx, 16rpx);
		}

		.member_header {

			@include flex_box(row, nowrap, space-between, center);

			.header_left {
				@include set_padding(0rpx, 15rpx);
				@include flex_box(row, nowrap, center, center);
			}

			.header_right {
				@include flex_box(row, nowrap, center, center);
				border-left: 1rpx solid rgba(0, 0, 0, 0.1);
				;
			}
		}

		.info_box {
			@include set_padding(0rpx, 12rpx);

			.photo_view_box {
				overflow: hidden;

				image {
					width: 100%;
					height: 100%;
					display: block;
				}
			}

			.user_name_box {
				max-width: 112rpx;
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;
			}
			.big_user_name_box {
				max-width: 260rpx;
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;
			}

			.info_view {
				@include flex_box(column, wrap, flex-start, flex-start);

				.name_box {
					@include flex_box(row, nowrap, space-between, center);
				}
			}

			.info_top {
				border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
				@include flex_box(row, nowrap, space-between, center);

				.top_left {
					@include flex_box(row, nowrap, flex-start, center);
				}
			}

			.bottom_left {
				@include flex_box(column, nowrap, flex-start, flex-end);

				.number {
					color: #FE5A1C;
				}
			}

			.info_bottom {
				@include flex_box(row, nowrap, space-between, center);


				.guide_left{
					width: calc(100% - 240rpx);
				}
				.bottom_right {
					@include flex_box(row, nowrap, center, center);
					// background-color: #323232;
					width: 224rpx;
					height: 80rpx;
					// background: #F08519;
					border-radius: 2000rpx 2000rpx 2000rpx 2000rpx;
				}
			}
		}
	}
</style>